import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import postcssPluginPx2rem from "postcss-plugin-px2rem"; 
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue()
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  build: {
    assetsInclude: /\.(png|jpe?g|gif|svg|ico|woff2?|eot|ttf|otf)$/i,
    assetsInlineLimit: 0, // 静态资源阈值，低于值则导入为base64编码，减少http请求
  },
  // 代理配置
  server: {
    cors: true, // 允许跨域    
    proxy: {
      '/api': { // 配置需要代理的路径 --> 这里的意思是代理http://localhost:80/api/后的所有路由
        target: 'http://192.168.3.18:9420/', // 目标地址 --> 服务器地址
        changeOrigin: true, // 允许跨域
        ws: true,  // 允许websocket代理
		    // 重写路径 --> 作用与vue配置pathRewrite作用相同
        rewrite: (path) => path.replace(/^\/api/, "/Cpop-Oam/website/")
      }
     },
  },
  // css: {
  //   postcss: {
  //     plugins: [postcssPluginPx2rem({
  //       rootValue: 100,  //换算基数， 100px === 1rem
  //       unitPrecision: 5, //允许REM单位增长到的十进制数字，其实就是精度控制
  //       // propWhiteList: [], // 默认值是一个空数组，这意味着禁用白名单并启用所有属性。
  //       // propBlackList: [], // 黑名单
  //       // exclude:false,  //默认false，可以（reg）利用正则表达式排除某些文件夹的方法，例如/(node_module)/ 。如果想把前端UI框架内的px也转换成rem，请把此属性设为默认值
  //       // selectorBlackList: [], //要忽略并保留为px的选择器
  //       // ignoreIdentifier: false, //（boolean/string）忽略单个属性的方法，启用ignoreidentifier后，replace将自动设置为true。
  //       // replace: true, // （布尔值）替换包含REM的规则，而不是添加回退。
  //       mediaQuery: false, //（布尔值）允许在媒体查询中转换px
  //       minPixelValue: 0  //设置要替换的最小像素值(3px会被转rem)。 默认 0
  //     })]
  //   }, // 引入你的PostCSS配置文件
  // },
})
